import { Fragment, defineComponent, reactive } from 'vue';
import { locationContainer, locationBtn, locating } from './Location.module.scss';
import { map, navi } from '@/store';
import marker, { locationMarker } from '@/store/modules/marker';
/*
---文件
*/
export const locationObj = reactive({
    isShow: true,
})

export default defineComponent({
    name: 'Location',
    data() {
        return {
        };
    },
    methods: {
        updatePosition() {
            console.log('当前位置', navi.curPosition);

            map.compassUpdate = !map.compassUpdate;
            if (!locationMarker) marker.setLocationMarker(navi.curPosition);
            navi.moveLocationCenter();
        }
    },
    render() {
        const { compassUpdate } = map;
        return <Fragment>
            <div class={locationContainer} v-if={locationObj.isShow} onClick={this.updatePosition}>
                <div class={`${compassUpdate ? locating : locationBtn}`}></div>
            </div>
        </Fragment>;
    },
});